<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>复合测试</title>
    <script src="../../static/js/jquery-2.1.4min.js"></script>
    <script src="../../static/bootstrap-4.5.0-dist/js/bootstrap.min.js"></script>
    <script src="../../static/js/index.js"></script>
    <link type="text/css" rel="stylesheet" href="../../static/index.css?version=1.0">
    <link href="../../static/bootstrap-4.5.0-dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>

<!-- 固定式头部-->

<div class="card"></div>

<div id="top">
    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
        <div class="container-fluid">

            <div class="navbar-header">
                <a class="navbar-brand" href="#">有意思书店</a>
            </div>

            <ul class="nav navbar-default navbar-toggle">
                test
            </ul>

            <form class="navbar-form navbar-left" role="search" id="center">
                <div class="form-group">
                    <input type="text" class="form-control" placeholder="搜索" id="search_input">
                </div>

                <div class="btn-group">
                    <button type="button" class="btn btn-default" id="search">按书名搜索</button>
                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                        <span class="caret"></span>
                    </button>
                    <ul class="dropdown-menu" role="menu" id="dropdown-menu" id="dropdown-menu">
                        <li><a id="change">按作者搜索</a></li>
                    </ul>
                </div>
            </form>

            <ul class="nav navbar-nav navbar-right">
                <li><a href="#"><span class="glyphicon glyphicon-user"></span> 注册</a></li>
                <li><a href="#"><span class="glyphicon glyphicon-log-in"></span> 登录</a></li>
            </ul>
        </div>
    </nav>
</div>
<!-- 主要内容-->
<div id="main">

    <div id="left">这是Left!</div>

    <div id="content">

        <div class=""></div>

        <div class="row">
            <div class="col-sm-6 col-md-3">
                <a href="#" class="thumbnail">
                    <img src="../../static/img/default_book_img.jpg"
                         alt="通用的占位符缩略图">
                </a>
                <div class="caption">
                    <h3>缩略图标签</h3>
                    <p>一些示例文本。一些示例文本。</p>
                    <p>
                        <a href="#" class="btn btn-primary" role="button">
                            按钮
                        </a>
                        <a href="#" class="btn btn-default" role="button">
                            按钮
                        </a>
                    </p>
                </div>
            </div>
            <div class="col-sm-6 col-md-3">
                <a href="#" class="thumbnail">
                    <img src="../../static/img/default_book_img.jpg"
                         alt="通用的占位符缩略图">
                </a>
                <div class="caption">
                    <h3>缩略图标签</h3>
                    <p>一些示例文本。一些示例文本。</p>
                    <p>
                        <a href="#" class="btn btn-primary" role="button">
                            按钮
                        </a>
                        <a href="#" class="btn btn-default" role="button">
                            按钮
                        </a>
                    </p>
                </div>
            </div>
            <div class="col-sm-6 col-md-3">
                <a href="#" class="thumbnail">
                    <img src="../../static/img/default_book_img.jpg"
                         alt="通用的占位符缩略图">
                </a>
                <div class="caption">
                    <h3>缩略图标签</h3>
                    <p>一些示例文本。一些示例文本。</p>
                    <p>
                        <a href="#" class="btn btn-primary" role="button">
                            按钮
                        </a>
                        <a href="#" class="btn btn-default" role="button">
                            按钮
                        </a>
                    </p>
                </div>
            </div>
            <div class="col-sm-6 col-md-3">
                <a href="#" class="thumbnail">
                    <img src="../../static/img/default_book_img.jpg"
                         alt="通用的占位符缩略图">
                </a>
                <div class="caption">
                    <h3>缩略图标签</h3>
                    <p>一些示例文本。一些示例文本。</p>
                    <p>
                        <a href="#" class="btn btn-primary" role="button">
                            按钮
                        </a>
                        <a href="#" class="btn btn-default" role="button">
                            按钮
                        </a>
                    </p>
                </div>
            </div>
        </div>
        这是Content!
        <br><br><br><br><br><br><br><br><br><br><br><br>
        <br><br><br><br><br><br><br><br><br><br><br><br>
        <br><br><br><br><br><br><br><br><br><br><br><br>
        <br><br><br><br><br><br><br><br><br><br><br><br>
        <br><br><br><br><br><br><br><br><br><br><br><br>
        <br><br><br><br><br><br><br><br><br><br><br><br>
        <ul class="pagination pagination-lg">
            <li><a href="#">&laquo;</a></li>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="#">3</a></li>
            <li><a href="#">4</a></li>
            <li><a href="#">5</a></li>
            <li><a href="#">&raquo;</a></li>
        </ul>
        <br><br>
        这是多行高度！
        <br>
    </div>

    <div id="right">这是Right!</div>

</div>
<!--底部-->
<div id="foot">
    <footer>
        <p>Luyishi.Copyright &copy;2020</p>
    </footer>
</div>
</body>
</html>